import { useRoutes } from "react-router-dom"
import routes from "./index"

/**
 * 动态路由组件
 * routes：代表所有路由
 * @returns 
 */
function DynamicRouter(){
    //根据routes动态生成路由映射组件
    //获取我自己能访问路由，和本地所有路由进行匹配。得到能范围跟路由。
    // const userRouter = routes.filter(item=>item.path != "/register")
    //后端会专门提供一个接口，登录成功得到路由数组。
    
    const userInfo = JSON.parse(localStorage.userInfo || "{}")
    if(Object.keys(userInfo).length != 0){
        const {role:{menus = []}} = userInfo
        // 处理用户的路由menus=["/home/user","/home/role"]
        const userRouter = menus.map(item=>{
            return item.substr(6)
        })
        //获取/home下面的子路由，和userRouter进行匹配
        const index = routes.findIndex(item=>item.path=="/home")
        let tempArray = [...routes[index].children]
        //进行对比筛选
        tempArray = tempArray.filter(item=>{
            if(userRouter.includes(item.path)){
                return true
            }
        })
        routes[index].children = tempArray
        console.log(userRouter);
    }

    const elements = useRoutes(routes)
    return elements
}

export default DynamicRouter